<template>
  <div class='box-wrap-total'>
    <section class='box-operation'>
      <div class="box-search">         
        <div class='form-group-enquire'>
          <DatePicker type="daterange" placeholder="日期" style="width: 190px" :editable=false v-model="searchDate" @on-change="changeDate" @on-clear="initDate"></DatePicker>
        </div>      
        <div class='form-group-enquire'>
          <el-select v-model="searchData.leader_id" placeholder="充值人员" clearable filterable>
            <el-option :value= row.id v-for="row in rolelist2" :label="row.name" :key= row.id >{{row.name}}</el-option>
          </el-select>
        </div>   
        <div class='form-group-img' @click='onSearchGetList()'><img src="../../assets/images/peach-svg/Frame 23.svg"></div>
        <div class='form-group-addimg2' @click='downloadFile(1,{})'><img src="../../assets/images/peach-svg/export.svg"></div>
      </div>
    </section>
    <LibVxeTable class="staticData" :stripe="stripe" 
    @onSelectChange="onCheckChange" border="none" 
    :show-footer="showFooter" :footer-method="footerMethodFunc" 
    :tableColumns="tableColumns" :tableData="list" :slotHeader="slotHeader" 
    :PageObj="{total:totalCnt,currentPage:searchData.page_index,pageSize:searchData.page_size}"  
    @onPageChange="onChangePageSize"
     resizable></LibVxeTable>
  </div>
</template>
<script>
import { mapGetters } from "vuex";
import utils from "../../commons/utils";
import {commonMixin} from "../../components/ViewInitMixin" //每一个文件都要包含这个
import {TimePicker} from "iview"
import SearchUser from "../searchUser"
import {ACDN} from "@/commons/staticName";
import Request from "../../commons/Request"

export default {
  name: "addUserDetailView",  //!!这块一定要注意，每一个文件都根据资源path来命名
  components:{TimePicker,SearchUser},
  mixins:[commonMixin],
  data() {
    return {
      stripe:false,       
      statuslist: [{id:1,name:'正常'},{id:2,name:'冻结'}],
      modal:false,
      searchDate:"",
      searchTime:[utils.dateFormat(0,"HH")+"00",utils.dateFormat(0,"HH")+"00"],
      searchData:{
        page_index:1,
        page_size:30,
        date:'',
        leader_id:"",
      },
      versionsList:[{Id:-1,Name:'全部版本'},{Id:1,Name:'v1'},{Id:2,Name:'v2'}],
      mnoList:{},
      provinceList:{},
      list:[],
      totalCnt:0,
      bpt: 0,
      rpt: 0,
      info:{},
      selectRows:[],
      channelList:[],
      cityList:[],
      cityInfo:[-1],
      partnerList:[],
      ChannelList:[],
      QdsPartnerList:[],
      QdsPartnerObj:{},
      BusinessList:[],
      BusinessObj:{},
      cityObj:{},
      brandObj:{},
      brandObjCh:{},
      roles:[],
      leaders:[],
      roleList:{},
      rollist:[],
      leaderlist:[],
      rolelist2:[],
      eid:"",
      tableColumns:[
        { 
        field: "Id",
        type:"checkbox",
        align: "center",
        width:50,
        },
        {
          title: "id",
          field: "seq",
          align: 'center',
        },
        {
          title: "充值日期",
          field: "date",
          align: 'center',
        },
        {
          title: "充值总额",
          field: "recharge_points_total",
          align: 'center',
          slots:{
            default:({row},h) =>{
              if(row.recharge_points_total==0){
                return [h("div",'-')]
              }else
              return [h("div",row.recharge_points_total/10000)]
            }
          }
        },
        {
          title: "赠送积分总额",
          field: "bonus_points_total",
          align: 'center',
          slots:{
            default:({row},h) =>{
              if(row.bonus_points_total==0){
                return [h("div",'-')]
              }else
              return [h("div",row.bonus_points_total/10000)]
            }
          }
        },
        {
          title: "充值人员",
          field: "creator_name",
          align: 'center',
          slots:{
            default:({row},h)=>{
                if (row.leader_name==''||row.leader_name==undefined) {
                    return [h("span","--")]
                }else{
                    return row.leader_name
                }
            }     
            }     
        } 
      ],
      format: {                 
      },       
      ruleValidate: {
      },      
      dateOptions:{
        disabledDate(date){
          return date && date.valueOf() > Date.now();
        },

      },
    };
  },
  computed: {
            ...mapGetters(["UserInfo"]),
        },
  methods: {
    async initView(isMounted){
      if(isMounted){
        await this.getList();
        await this.initSearchData();
      }

    },
    onCheckChange(rows){
        this.selectRows = [];
        this.selectRows = rows;
    },
    //导出
    async downloadFile() {
      // utils.showLoading("正在生成中")
      let new_ids=""
      let new_seqs=""
      if(this.selectRows.records!=undefined){
        //导出值用id|id形式拼接
        this.selectRows.records.forEach(item => {
          new_ids+='|'+item.id
          new_seqs+="|"+item.seq
        });
        if(new_ids!=''){
          new_ids=new_ids.substring(1)
        }
         if(new_seqs!=''){
          new_seqs=new_seqs.substring(1)
        }
        let res = await this.RequestPost("export_list",{"ids":new_ids,"seqs":new_seqs});
        if(res.code==0){
          utils.hideLoading()
            await utils.sleepMs(500);
            // let blob=new Blob([res.data],{type:'app/xml'})
            // utils.showTip("导出成功，在IM中查收");
            window.location.href = ACDN+res.data
        }else{
          utils.showSureModal({"icon":require('../../assets/images/peach-svg/bluegth.svg'),
         "modalContent":res.data,
         "title":"提示"});
        }
        
      }else{
         utils.showSureModal({"icon":require('../../assets/images/peach-svg/bluegth.svg'),
         "modalContent":"请选择一项 ",
         "title":"提示"});
      }
      
    }, 
    async initSearchData() {
      let res2 = await Request.post("customer/user", "query_list",{role_id:this.UserInfo.role_id});
      if(res2.code==0 && res2.data != null){
        res2.data.list.forEach((item) => {
          this.rolelist2.push({id:item.id,name:item.account});
        })  
      }
    },
    onSearchGetList(){
      this.searchData.page_index =1;
      this.getList();
    },
    async getList(){
      utils.showLoading()
      let res = await this.RequestPost("query_list",this.searchData);
      console.log(res,'srea');     
      if(res.code==0 && res.data != null){
        this.list = [];
        if(res.data.list!=null) this.list = res.data.list;
        this.totalCnt = res.data.total
        this.rpt = res.data.all.rpt
        this.bpt = res.data.all.bpt
      }
      await utils.sleepMs(500)
      utils.hideLoading();
    },           
    onChangePageSize(page,pageSize){
      this.modal = true        
      this.searchData.page_index = page;
      this.searchData.page_size = pageSize;
      this.getList();
    },
    changeDate(){
      let firstDay = this.searchDate[0].Format('yyyy-MM-dd')
      let lastDay = this.searchDate[1].Format('yyyy-MM-dd')
      let date = [firstDay,lastDay]
      if(this.searchData.date=='NaN-aN-aN,NaN-aN-aN'){
        this.searchData.date=''
      }else {
          this.searchData.date = date.join(',')
      }
      this.onSearchGetList();
    },
    initDate(){
      let nowDay = ""
      let beginDay = nowDay;
      let endDay = nowDay;
      this.searchDate = [new Date(beginDay),new Date(endDay)];
      this.changeDate();
    },       
    onSelectChange(label,value,reset){
      console.log(label,'onSelectChange');
      console.log(value,'onSelectChange');
    },    
    slotHeader(h) {
      return [h("div",{class:{"allCount":true},"style":{"margin-left":"10px"}})]
    },
    //总计
    footerMethodFunc({ columns, data }){
      return [columns.map((item,index) => {
          if(index ==0){
            return '总计'
          }else if(['充值总额'].includes(item.title)){
            return this.rpt / 10000
          }else if(['赠送积分总额'].includes(item.title)){
            return this.bpt / 10000
          }
          return null
        })
      ]
    },  
    unitprice(data){
      let bonus_points_total = 0
      data.forEach(item =>{
        bonus_points_total+=item.bonus_points_total
      })
      return bonus_points_total
    },   
    total(data){
      let recharge_points_total = 0
      data.forEach(item =>{
        recharge_points_total+=item.recharge_points_total
      })
      return recharge_points_total
    },          
    showFooter(){
     if(this.footerMethod){
         return true;
     }else{
         return false;
     }      
    }  
  },
};
</script>  